@function getRem($pixel) {
  @return $pixel/200*1rem;
}
@function getRemFour($top, $right, $bottom, $left) {
  @return $top/200*1rem $right/200*1rem $bottom/200*1rem $left/200*1rem;
}

.spaceContain {
  header {
    position: relative;
    .back {
      width: 100%;
      height: getRem(300);
    }
    nav {
      position: absolute;
      top: getRem(200);
      left: getRem(50);
      img {
        width: getRem(200);
        height: getRem(200);
        overflow: hidden;
        border-radius: getRem(100);
        border: getRem(2) solid #fff;
        background: #fff;
      }
      input {
        display: none;
      }
      p {
        font-size: getRem(40);
        text-align: center;
      }
    }
  }
  section {
    width: 100%;
    margin-top: getRem(170);
    p {
      text-align: left;
      font-size: getRem(35);
      height: getRem(100);
      line-height: getRem(100);
      border-top: 1px solid #ccc;
      border-bottom: 1px solid #ccc;

      text-indent: 2em;
    }
    .historicalRecords {
      margin-bottom: getRem(20);
      a {
        display: block;
        padding: getRem(20) getRem(10);
        height: getRem(160);
        overflow: hidden;
        img {
          width: getRem(230);
          height: getRem(140);
          display: block;
          float: left;
          border-radius: getRem(10);
        }
        .items {
          float: left;
          width: getRem(480);
          aside {
            font-size: getRem(28);
            line-height: getRem(40);
            color: #000;
            width: getRem(450);
            height: getRem(80);
            overflow: hidden;
            text-overflow: ellipsis;
            text-align: justify;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            margin-left: getRem(20);
          }
          span {
            display: block;
            color: #aab0c6;
            margin-left: getRem(20);
          }
        }
      }
    }
  }
}
